<form id="edit-form" class="form-horizontal" role="form" data-toggle="validator" method="POST" action="">

    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Product_name')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-product_name" data-rule="required" class="form-control" name="row[product_name]" type="text"  value="{$row.product_name|htmlentities}">
        </div>
    </div>

    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('type')}:</label>
        <div class="col-xs-12 col-sm-8">

            <div class="radio">
                {foreach name="typeList" item="vo" key="key"}
                <label for="row[type]-{$key}">
                    <input id="row[type]-{$key}" name="row[type]" type="radio" value="{$key}" {if $key == $row.type}checked{/if} /> {$vo}
                </label>
                {/foreach}
            </div>

        </div>
    </div>

    <input value="{$row.tagid}" id="tagids" style="display: none">


    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">分类</label>
        <div class="col-xs-12 col-sm-8">
            <select name="row[tagid][]" class="form-control selectpicker" data-rule="required" id="tagid-select" required data-live-search="true" multiple>
                <option value="">请选择</option>
                <!-- 动态填充选项 -->
            </select>
        </div>
    </div>

    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Image')}:</label>
        <div class="col-xs-12 col-sm-8">
            <div class="input-group">
                <input id="c-image" class="form-control" size="50" name="row[image]" type="text"  value="{$row.image|htmlentities}">
                <div class="input-group-addon no-border no-padding">
                    <span><button type="button" id="faupload-image" class="btn btn-danger faupload" data-input-id="c-image" data-mimetype="image/gif,image/jpeg,image/png,image/jpg,image/bmp,image/webp" data-multiple="false" data-preview-id="p-image"><i class="fa fa-upload"></i> {:__('Upload')}</button></span>
                </div>
                <span class="msg-box n-right" for="c-image"></span>
            </div>
            <ul class="row list-inline faupload-preview" id="p-image"></ul>
        </div>
    </div>

    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Carousel')}:</label>
        <div class="col-xs-12 col-sm-8">
            <div class="input-group">
                <input id="c-carousel" class="form-control" size="50" name="row[carousel]" type="text" value="{$row.carousel|htmlentities}">
                <div class="input-group-addon no-border no-padding">
                    <span><button type="button" id="faupload-carousel" class="btn btn-danger faupload" data-input-id="c-carousel" data-mimetype="image/gif,image/jpeg,image/png,image/jpg,image/bmp,image/webp" data-multiple="true" data-preview-id="p-carousel"><i class="fa fa-upload"></i> {:__('Upload')}</button></span>
                </div>
                <span class="msg-box n-right" for="c-carousel"></span>
            </div>
            <ul class="row list-inline faupload-preview" id="p-carousel"></ul>
        </div>
    </div>


    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Price')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-price" data-rule="required" class="form-control" step="0.01" name="row[price]" type="number" value="{$row.price|htmlentities}">
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Remarks')}:</label>
        <div class="col-xs-12 col-sm-8">
            <textarea id="c-remarks" class="form-control " rows="5" name="row[remarks]" cols="50">{$row.remarks|htmlentities}</textarea>
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Rich_text')}:</label>
        <div class="col-xs-12 col-sm-8">
            <textarea id="c-rich_text" class="form-control editor" rows="5" name="row[rich_text]" cols="50">{$row.rich_text|htmlentities}</textarea>
        </div>
    </div>


    <div class="form-group layer-footer">
        <label class="control-label col-xs-12 col-sm-2"></label>
        <div class="col-xs-12 col-sm-8">
            <button type="submit" class="btn btn-primary btn-embossed disabled">{:__('OK')}</button>
        </div>
    </div>
</form>
<script src="__ROOT__/assets/libs/jquery/dist/jquery.min.js"></script>

<script>
    $(document).ready(function() {
        // 直接获取选中的 type 值
        var selectedType = $('input[name="row[type]"]:checked').val();
        append(selectedType)
        function append(type){

            // 发起 AJAX 请求获取可用性选项
            $.ajax({
                url: '/houtai.php/worktags/tags', // 替换为实际的 API 地址
                type: 'GET',
                data: { type: type },
                success: function(data) {
                    // 假设返回的数据格式是 { success: true, options: [...] }
                    if (data.code==1) {
                        var options = data.list;
                        // 清空之前的选项
                        $('#tagid-select').empty();

                        var selectedTagIds = $('#tagids').val().split(',').map(function(id) {
                            return parseInt(id, 10); // 转换为整数
                        });

                        // 添加新的选项
                        options.forEach(function(option) {
                            $('#tagid-select').append($('<option>', {
                                value: option.id,
                                text: option.name,// 假设返回的数据有 id 和 name
                                selected: selectedTagIds.includes(option.id) // 检查是否该 id 是要
                            }));
                        });

                    } else {
                        $('#tagid-select').empty().append('<option value="">没有可用的选项</option>');
                    }
                    $('#tagid-select').selectpicker('refresh'); // 更新 selectpicker 显示
                },
                error: function() {
                    $('#tagid-select').empty().append('<option value="">加载失败</option>');
                    $('#tagid-select').selectpicker('refresh');
                }
            });
        }
    })
</script>
